<template>
	<view class="enterprise-content">
		<view class="search-block">
			<input maxlength="20" @blur="inputChange" placeholder-class="inputPlaceholder" placeholder="请输入关键词" />
			<view class="iconfont icon-sousuo"></view>
		</view>
		<view class="list-block">
			<view @click="navigate(item.id)" v-for="(item,index) in enterprise" :key="item.id" class="enterprise-item">
				<image mode="aspectFill" :src="item.logoUrl?item.logoUrl:imageUrl+'/job_hunting/job_detail/enterprise.jpg'" class="photo"></image>
				<view class="info-block">
					<view class="name">{{item.enterpriseName}}</view>
					<view class="count">{{positionData&&positionData[item.id]?`已选${positionData[item.id].length}个岗位`:'暂无选择'}}</view>
				</view>
			</view>
		</view>
		<view class="create-btn" @click="onBack">确定</view>
	</view>
</template>

<script>
	import {getStorage} from '@/util/auth.js'
	import {getEnterpriseAll} from '@/api/live.js';
	export default{
		data(){
			return{
				positionData:null,
				enterprise:[],
				keyword:'',
				imageUrl:'',
			}
		},
		methods:{
			onBack(){
				uni.navigateBack()
			},
			navigate(id){
				uni.navigateTo({
					url:`/page_other/live/position?id=${id}`
				})
			},
			inputChange(e){
				const value=e.detail.value;
				if(value!=this.keyword){
					this.keyword=value;
					this.getList();
				}
			},
			getList(){
				uni.showLoading({
					title:'加载中',
					mask:true
				})
				getEnterpriseAll({comName:this.keyword}).then((res)=>{
					uni.hideLoading();
					this.enterprise=res??[];
				}).catch((res)=>{
					uni.hideLoading();
					this.showToast('加载失败，请重试');
				})
			}
		},
		onShow() {
			const positionData=getStorage('positionData');
			if(positionData){
				this.positionData=positionData;
			}
		},
		onLoad() {
			this.getList()
			this.imageUrl=this.globalConfig.imageUrl;
		}
	}
</script>

<style lang="scss" scoped>
	.enterprise-content{
		padding: 30rpx;
		.search-block{
			background: #f4f4f4;
			color: #999;
			font-size: 28rpx;
			display: flex;
			flex-direction: row;
			align-items: center;
			padding: 0 20rpx;
			border-radius: 40rpx;
			height: 60rpx;
			margin-bottom: 30rpx;
			.iconfont{
				flex-grow: 0;
				font-size: 38rpx;
				font-weight: bold;
			}
			input{
				flex-grow: 1;
			}
		}
		.list-block{
			width: 100%;
			display: flex;
			flex-direction: column;
			overflow-y: scroll;
			max-height: calc(100vh - 270rpx);
			.enterprise-item{
				background: #fafafa;
				border-radius: 10rpx;
				padding: 20rpx;
				display: flex;
				flex-direction: row;
				margin-bottom: 30rpx;
				.photo{
					width: 100rpx;
					height: 100rpx;
					border-radius: 16rpx;
					background: #f0f0f0;
					margin-right: 20rpx;
				}
				.info-block{
					width: calc(100% - 120rpx);
					height: 100rpx;
					display: flex;
					flex-direction: column;
					justify-content: space-between;
					.name{
						font-weight: bold;
						font-size: 30rpx;
					}
					.count{
						font-size: 28rpx;
						color:#fe7725;
					}
				}
			}
		}
		.create-btn{
			position: fixed;
			transform: translate(-50%,-50%);
			bottom: 0;
			left: 50%;
			width:400rpx;
			height: 80rpx;
			background: #FF7626;
			color:#fff;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 40rpx;
		}
	}
</style>